<section>
  <app-loading [loading]="loading"></app-loading>
  <div class="pue-header">
    <p>PUE<span>last update 12:33 am</span></p>

    <div class="pue-action">

      <!-- Edit Threshold -S -->
      <button class="btn btn-default" (click)="editThreshold()">Edit Threshold</button>
      <!-- Edit Threshold -E -->

      <!-- rack monitor Actions -S -->
      <div class="form-group">
        <select class="form-control" [(ngModel)]="dateRange" (ngModelChange)="getHistoryPUEData(dateRange)">
          <option value="" selected>Date Range</option>
          <option value="week">A week</option>
          <option value="halfMonth">Half a Month</option>
          <option value="month">A Month</option>
          <option value="year">A Year</option>
        </select>
      </div>
      <!-- rack monitor Actions -E -->
      <i class="iconfont icon-refresh" (click)="refresh()"></i>
    </div>


  </div>
  <div class="pue-con" >
    <div echarts [options]="gaugeOptions" class="gauge"></div>
    <app-line-chart [dataList]="dataList" [timeStamp]="timeStamp" [hideLegend]="true" class="line-chart"></app-line-chart>
  </div>
</section>
